<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>改变透明度</title>
	<style>
		#outer{
			width: 800px;
			margin: 20px auto;
		}
		img{
			border: 1px solid #ccc;
			padding: 3px;
			opacity: 0.3;
		}
	</style>
	<script>
		var Im = document.getElementsByTagName('img');
		window.onload = function(){
			for (var i = 0; i < Im.length; i++) {
				Im[i].onmouseover = function(){
				this.style.opacity = '1'
			    }
			    Im[i].onmouseout = function(){
				this.style.opacity = '0.3'
			    }
			}
		}

	</script>
</head>
<body>
	<div id="outer">
		<div >
			<img src="E:\001练习\04-21\img\001.jpg" alt="">
			<img src="E:\001练习\04-21\img\002.jpg" alt="">
			<img src="E:\001练习\04-21\img\003.jpg" alt="">
			<img src="E:\001练习\04-21\img\004.jpg" alt="">
			<img src="E:\001练习\04-21\img\005.jpg" alt="">
		</div>
		<div >
			<img src="E:\001练习\04-21\img\006.jpg" alt="">
			<img src="E:\001练习\04-21\img\007.jpg" alt="">
			<img src="E:\001练习\04-21\img\008.jpg" alt="">
			<img src="E:\001练习\04-21\img\009.jpg" alt="">
			<img src="E:\001练习\04-21\img\010.jpg" alt="">
		</div>
	</div>
</body>
</html>